<!--奢侈品查询-->
<template>

	<div id="luxuryGoodsSearchList" class="container-fluid">

    
		
	<div class="panel panel-primary">
      <div class="panel-heading">
        <h3 class="panel-title">查询条件</h3>
      </div>
      <div class="panel-body">
				 <el-form inline="true" model="formInline" class="demo-form-inline">

				  <el-form-item label="商品名称">
				    <el-input  placeholder="商品名称" v-model="form.name"></el-input>
				  </el-form-item>
          <el-form-item label="店铺名称">
            <el-input  placeholder="店铺名称" v-model="form.storeName"></el-input>
          </el-form-item>

          <!--    <el-form-item label="商品货号">
            <el-input  placeholder="商品编号" v-model="form.articleNumber"></el-input>
          </el-form-item>
          <el-form-item label="商品编号">
            <el-input  placeholder="商品编号" v-model="form.productCode"></el-input>
          </el-form-item> -->

          <el-form-item label="商品状态">
              <el-select v-model="form.status"  placeholder="请选择">
                <el-option label="全部" :value="-1" >全部</el-option>
                <el-option label="已删除"    :value="0" >删除</el-option>
                <el-option label="正常"  :value="1">正常</el-option>
                <el-option label="下架"  :value="3">下架</el-option>
                <el-option label="待审核"  :value="4">待审核</el-option>
                <el-option label="审核通过"  :value="5">审核通过</el-option>
                <el-option label="审批未通过"  :value="6">审批未通过</el-option>
              </el-select>
          </el-form-item>

        <el-form-item label="创建时间">
              <el-date-picker
                v-model="time"
                type="daterange"
                align="right"
                placeholder="选择日期范围"
                :picker-options="pickerOptions2">
              </el-date-picker> 
          </el-form-item>


          <el-form-item>
				    <el-button type="primary" @click="onSubmit">查询</el-button>
				  </el-form-item>
				</el-form>

         <div class="panel-body">

          <el-tag v-if="!!form.storeId" :key="form.storeIdName" :closable="true" type="gray"  
          @close="handleClose(tag)">
            {{form.storeIdName}}
          </el-tag>

        </div>

      </div>
    </div>

     <div class="panel panel-info">
      <div class="panel-heading">
        <h3 class="panel-title">排序</h3>
      </div>
      <div class="panel-body">
       	
      </div>
    </div>


    <div class="panel panel-success">
      <div class="panel-heading">
        <h3 class="panel-title">查询结果</h3>
      </div>
      <div class="panel-body">
     		<table class="table table-striped table table-bordered table-condensed" 
               v-loading.body="loading" style="width: 100%">
				
			 	<thead>
			 		<tr>
           <!--  <th>序号</th> -->
            <th>店铺</th>
			 			<th>图片</th>
			 			<th>名称</th>
			 			<th>sku</th>
			 			<th>价格</th>
			 			<th>销量</th>
			 			<th>库存</th>
			 			<th>分类</th>
			 			<th>状态</th>
            <th>录入时间</th>
			 			<th>操作</th>
			 		</tr>
			 	</thead>

			 	<tbody>
			 	    
          <tr v-for="p in dataList">
             <!--  <td>{{p.uuid}}</td> -->
              <td @click="selectStoreId(p.shopId,p.shopName)">
                <el-tag type="primary" >  
                  {{p.shopName}}
                </el-tag>
              </td>
              <td style="width:100px;"> <img :src="p.defaultImage" style="width:100px;height:80px;"/></td>
              <td style="max-width:100px;">{{p.name}}
                  
              </td>
              <td>
                  <table class="table table-striped table table-bordered table-condensed">
                        <tr>
                            <th>名称</th>
                            <th>编码</th>
                            <th>价格</th>
                            <th>销量</th>
                            <th>库存</th>
                        </tr>
                        <tr v-for="sku in p.skus">
                            <td>{{sku.attribute}}</td>
                            <td>{{sku.productCode}}</td>
                            <td>{{sku.currentPrice}}</td>
                            <td>{{sku.purchaseQuantity}}</td>
                            <td>{{sku.accountQuantity}}</td>
                        </tr>
                    </table>
              </td>
              <td>{{p.basicPrice}}</td>
              <td>{{p.purchaseQuantity}}</td>
              <td>{{p.accountQuantity}}</td>
              <td>{{p.productCategory}}</td>
              <td>
                  <el-tag v-if="p.status==1">{{p.statusName}}</el-tag>
                  <el-tag v-if="p.status==3" type="gray">{{p.statusName}}</el-tag>
                  <el-tag v-if="p.status==4" type="primary">{{p.statusName}}</el-tag>
                  <el-tag v-if="p.status==5" type="success">{{p.statusName}}</el-tag>
                  <el-tag v-if="p.status==6" type="warning" >{{p.statusName}}</el-tag>
                  <el-tag v-if="p.status==0" type="danger" >{{p.statusName}}</el-tag>
              </td>
               <td>{{p.inputOn}}</td>
              <td>
                  <router-link :to="{name:'luxuryGoodsDetail',params:{id:p.uuid} }">
                    <el-button type="info" size="mini">查看详情</el-button>
                  </router-link>
                  
                  <!--审核-->
                  <el-button v-if="p.status==4" type="success" size="mini" 
                  @click="shenhe(p.uuid,5,'通过')">通过</el-button>
                  <el-button v-if="p.status==4" type="warning" size="mini"
                   @click="shenhe(p.uuid,6,'不通过')">不通过</el-button>
                  <!--删除-->
                  <el-button type="danger" size="mini" 
                    @click="deleteProduct(p.uuid)">删除
                 </el-button>
                 <!--上架-->
                  <el-button type="danger" size="mini" v-if="p.status==3"
                    @click="productshangxiajia(p.uuid,1,'上架')">上架
                 </el-button>
                 <!--下架-->
                <el-button type="danger" size="mini" v-if="p.status==1"
                    @click="productshangxiajia(p.uuid,3,'下架')">下架
                 </el-button>
              </td>
          </tr>


			 	</tbody>

			</table>


       <div class="block">
       
        <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="this.form.pageNum"
          :page-sizes="[10, 20, 30, 40]"
          :page-size="form.pageSize"
          layout="total, sizes, prev, pager, next, jumper"
          :total="page.totalSize">
        </el-pagination>
      </div>

      </div>
    </div>

	</div>

		
</template>

<script>
  import axios from 'axios'
  export default{
  	data () {
  		return {
          form:{
            name: "",
            articleNumber: "",
            productCode: "",
            status: -1,
            brandId: "",
            productCategoryId: "",
            sortStatus: 2,
            inputStartTime:'',
            inputEndTime: "",
            pageNum: 1,
            pageSize: 10,
            storeId:"",
            storeName:"",
            storeIdName:""
          },
          dataList:[],
          loading:true,
          time:"",
          page:{
              totalSize: ''
          },
          pickerOptions2: {
          shortcuts: [{
            text: '最近一周',
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit('pick', [start, end]);
            }
          }, {
            text: '最近一个月',
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
              picker.$emit('pick', [start, end]);
            }
          }, {
            text: '最近三个月',
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
              picker.$emit('pick', [start, end]);
            }
          }]
        }
        
  		}
  	},
    mounted(){
      this.searchList();
    },
  	methods:{
  		searchList (){
        this.loading=true;
        let param=this.form;
         if(!!this.time){
            param.inputStartTime=this.time[0].Format("yyyy-MM-dd");
            param.inputEndTime=this.time[1].Format("yyyy-MM-dd");
         }else{
          delete param.inputStartTime;
          delete param.inputEndTime;
         }
         if(!!!param.storeId)
          delete param.storeId;
  			axios.post("/api/luxuryProduct/queryStoreList",param).then((res) => {
          this.dataList=[]
          this.page.totalSize=0;
           this.loading=false;
           if(res.data.code==9999){
              this.dataList=res.data.data.list;
              this.page.totalSize=res.data.data.total;
           } 
  			},(res) =>{
        });
  		},
      
      //查询按钮
      onSubmit (){
        this.searchList();
      },
      //分页
      handleCurrentChange(pageNum){
        this.form.pageNum=pageNum;
        this.searchList();
      },
      //页码
      handleSizeChange(pageSize){
        this.form.pageSize=pageSize;
        this.searchList();
      },
      selectStoreId(storeId,storeName){    
        this.form.storeId=storeId;
        this.form.storeIdName=storeName;
        this.searchList();
      },
      shenhe(id,status,statusName){
        let param={};
        param.status=status;
        param.id=id;
        param.type=21;
        axios.post("/api/luxuryProduct/updateProductStatus",param).then((res) => {
            if(res.data.code==9999){
               this.$message({
                message: '修改成功',
                type: 'success'
              });
              for(let i in this.dataList){
                if(param.id==this.dataList[i].uuid){
                  this.dataList[i].status=status;
                  this.dataList[i].statusName=statusName;
                }
              } 
        }
        },(res) => {

        });

      },
      //删除商品
      deleteProduct(uuid){
        let param={};
        param.id=uuid;
        param.type=21;
        this.$confirm('确定要删除该商品吗', 'Warning', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          axios.post("/api/luxuryProduct/deleteProduct",param).then((res) => {
            if(res.data.code==9999){
              this.$message({
                type: 'success',
                message: '删除成功'
              }); 

            for(let i in this.dataList){
                if(param.id==this.dataList[i].uuid){
                  this.dataList[i].status=0;
                  this.dataList[i].statusName="已删除";
                }
              } 

            }else{
              this.$message({
                type: 'danger',
                message: '删除失败'
              });  
            }
          },(res) => {

          })
        });
      },
      //上下架
      productshangxiajia(uuid,status,statusName){
        let param={};
        param.id=uuid;
        param.type=21;
        param.status=status;
        axios.post("/api/luxuryProduct/productShelves",param).then((res) => {
               if(res.data.code==9999){
               this.$message({
                message: statusName+'成功',
                type: 'success'
              });
              for(let i in this.dataList){
                if(param.id==this.dataList[i].uuid){
                  this.dataList[i].status=status;
                  this.dataList[i].statusName=statusName;
                }
              } 
           }
          },(res) => {

          })
      },
      selectStoreId(storeId,storeName){    
        this.form.storeId=storeId;
        this.form.storeIdName=storeName;
        this.searchList();
      },
      handleClose(){
        this.form.storeId='';
        this.form.storeIdName='';
        this.searchList();
      }
  	}
  }
	
</script>

<style lang="less" scoped>

<style>